export default {
    name: "security",
    data() {
        return {
            carouselList:[
                {url:"images/carousel1.jpg",id:1},
                {url:"images/carousel2.jpg",id:2},
                {url:"images/carousel3.jpg",id:3},
                {url:"images/carousel4.jpg",id:4},
                {url:"images/carousel5.jpg",id:5},
                {url:"images/carousel6.jpg",id:6},
                {url:"images/carousel5.jpg",id:7},
                {url:"images/carousel6.jpg",id:8},
            ],
            pieNameList:[],
            userList:[],
            companyList:[],
            title:"卫士单位排名",//总排名弹框名称
            inputText:"",
            totalList:[],//总排名列表
            placeholder:"请输入单位",//提示语
            tabList:[
                {name:"活动情况",id:1},
                {name:"单位排名",id:2},
                {name:"志愿者排名",id:3},
            ],
            categoryShow:false,//导航菜单是否显示
            isActive:"活动情况",//高亮显示
            isActiveShow:true,//活动统计是否显示
            isCompanyShow:false,//公司是否显示
            isGuardShow:false,//志愿者是否显示
        }
    },
    created : function() {
        //轮播
        this.$post(url.getCarousel, {})
            .then((response) => {
                for(var i in response.data) {
                    response.data[i].url = url.prefixUrl + response.data[i].url;
                    this.carouselList[i] = response.data[i];
                    var timer=setTimeout(function () {
                        $(".el-carousel__button").width(20);
                        clearTimeout(timer);
                    },200)
                }
            }).catch(err => {
            console.log(err);
        })
        this.loadList();
    },
    mounted : function() {
        $(".el-carousel__arrow i").css("font-size","24px")
        let _this= this;
        //饼状图
        this.$post(url.statisticsActivity, {})
            .then((response) => {
                let data = response.data;
                for(let name in data){
                    let value = {name:(name==""?"未定义":name),value:data[name]};
                    _this.pieNameList.push(value);
                }
                var totalPie = this.echarts.init(document.getElementById('total-statistics'));
                var colorNewDemands=["#0FDBFC","#FDB628","#2465F9","#8B56F3"];
                var option = {
                    tooltip: {
                        trigger: 'item',
                        formatter: '{b} : {c} ({d}%)',
                        textStyle:{
                            fontSize:18,
                        },
                    },
                    color:["#249CF9","#FDB628","#63DCE3","#EB6F49","#2465F9"],

                    series: [
                        {
                            type: 'pie',
                            radius: '60%',
                            center: ['50%', '50%'],
                            label: {
                                formatter: '{b}\n{c}次',
                                fontSize:18,
                                color: "#2f3776"
                            },
                            labelLine:{
                                lineStyle:{
                                    color: "#2f3776"
                                }
                            },
                            selectedMode: 'single',
                            data:_this.pieNameList
                        }
                    ]
                };
                totalPie.setOption(option,true);
            }).catch(err => {
            console.log(err);
        })
    },
    methods: {
        /*导航菜单是否显示*/
        toggleCategory:function(){
            this.categoryShow=!this.categoryShow;
        },
        /*跳转到其他导航栏*/
        switchTab:function(name){
            if(name=="活动情况"){
                this.isGuardShow=false;
                this.isCompanyShow=false;
                this.isActiveShow = !this.isActiveShow;
                if(this.isActiveShow){
                    this.isActive="活动情况";
                }else{
                    this.isActive="";
                }
            }else  if(name=="单位排名"){
                this.isActive="单位排名";
                this.isGuardShow=false;
                this.isCompanyShow=!this.isCompanyShow;
                this.isActiveShow = false;
                if(this.isCompanyShow){
                    this.isActive="单位排名";
                }else{
                    this.isActive="";
                }
            }else{
                this.isActive="志愿者排名";
                this.isGuardShow=!this.isGuardShow;
                this.isCompanyShow=false;
                this.isActiveShow = false;
                if(this.isGuardShow){
                    this.isActive="志愿者排名";
                }else{
                    this.isActive="";
                }
            }
        },
        /*查看全部排名*/
        openTotal:function(type){
            this.title=type=="单位"?"卫士单位排名":"卫士排名";
            if(this.title=="卫士单位排名"){
                this.placeholder="请输入单位";
            }else{
                this.placeholder="请输入姓名";
            }
            this.totalList=type=="单位"?this.companyList:this.userList;
            this.$(".property_modal").css("display","block");
        },
        /*关闭弹框*/
        offBoxs:function(){
            this.inputText="";
            this.$(".property_modal").css("display","none");
        },
        loadList:function(){
            let param =
            {
                count:'false',
                sortFile: "SUM( ta.points )",
            }

            let _this = this;

            //用户列表
            this.$post(url.userList, param)
                .then((response) => {
                    _this.userList = response.data.context;
                }).catch(err => {
                console.log(err);
            })

            //公司列表
            this.$post(url.userListCompany, {})
                .then((response) => {
                    _this.companyList = response.data;
                }).catch(err => {
                console.log(err);
            })
        },
        search:function () {
            this.totalList = [];
            let showList;
            let key = "company";

            if(this.title=="卫士单位排名"){
                showList = this.companyList
            }else{
                key = "name";
                showList = this.userList
            }
            for (let i = 0; i < showList.length; i++) {
                if(showList[i][key].indexOf(this.inputText) > -1){
                    this.totalList.push(showList[i]);
                }
            }
        }
    }
}
